<template>
  <div class="null">
    <div class="header"><i>404</i></div>
    <span><i>对不起，页面丢了！！！</i></span>
    <button @click="GoBank">返回上页</button>
  </div>
</template>

<script>
  export default {
    name: "404",
    data() {
      return {}
    },
    created() {
      this.$router.replace({path: '/404', query: {showHead: true}})
    },
    methods: {
      GoBank() {
        this.$router.go(-1);
      }
    }
  }
</script>

<style scoped lang="scss">
  .null {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    .header{
      margin-bottom: 50px;
      i{
        font-size: 38px;
      }
    }

    i {
      font-size: 24px;
      font-weight: bold;
      color: red;
    }
    button {
      width: 80%;
      height: 50px;
      border: none;
      background: fuchsia;
      color: white;
      font-size: 24px;
      border-radius: 10px;
      margin-top: 30px;
    }
  }

</style>
